import type { RouteRecordRaw } from 'vue-router';
import { createRouter, createWebHistory } from 'vue-router';

const routes: RouteRecordRaw[] = [
  {
    path: '/',
    name: 'Home',
    component: () => import('@/views/Home.vue'),
    meta: {
      title: '首页',
    },
  },
  {
    path: '/element-form',
    name: 'ElementForm',
    component: () => import('@/views/ElementForm.vue'),
    meta: {
      title: 'Element Plus表单',
    },
  },
  {
    path: '/ant-form',
    name: 'AntForm',
    component: () => import('@/views/AntForm.vue'),
    meta: {
      title: 'Ant Design表单',
    },
  },
  {
    path: '/theme-demo',
    name: 'ThemeDemo',
    component: () => import('@/views/ThemeDemo.vue'),
    meta: {
      title: '主题切换演示',
    },
  },
];

const router = createRouter({
  history: createWebHistory(),
  routes,
});

// 路由守卫，设置页面标题
router.beforeEach((to, from, next) => {
  if (to.meta?.title) {
    document.title = `${to.meta.title} - Vue 3测试应用`;
  }
  next();
});

export default router;
